<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>我的众帮点</title>    
    <link href="../css/mui.min.css" rel="stylesheet"/>
   	<link rel="stylesheet" type="text/css" href="../css/mgPublic.css"/>
   	<link rel="stylesheet" type="text/css" href="../css/mggj.css"/>
    <link rel="stylesheet" type="text/css"/>
    <style type="text/css">
    	body{
		    background-image: -webkit-linear-gradient(180deg, #fff, #edead8);
		    background-image: -moz-linear-gradient(180deg, #fff, #edead8);
		    background-image: -o-linear-gradient(180deg, #fff, #edead8);
		    background-image: linear-gradient(180deg, #fff, #edead8);
    	}
    	.mui-scroll-wrapper{top: 44px;}
    </style>
</head>
<body>
<header class="mui-bar mui-bar-nav head_bar">
   <a class="mui-left mui-action-back mui-icon mui-icon-back mui-pull-left" href="##"></a>
    <h1 class="mui-title">我的众帮点</h1>
    <!--<a class="mui-icon iconfont icon-hongbao mui-pull-right action_menu"></a>-->
</header>
<div class="mui-content">
	<div class="mui-scroll-wrapper">
	    <div class="mui-scroll">
	        <h2 class="help_bit_head">您当前排名：03</h2>
	        <div class="rank_big_box">
			<!--第一行(lineFirst)-->
			<div class="lineF">
				<div class="boxF">
					<div class="boxS">
						<div class="boxT firstBox">
							<div class="rank_box">
								<p>01</p>
								<img src="../images/my/speeker_1.png">
							</div>
						</div>
					</div>
				</div>
				
			</div>
			<!--第二行(lineSecond)-->
			<div class="line3">
				<div class="boxF">
					<div class="boxS">
						<div class="boxT secondBox">
							<div class="rank_box">
							<p>02</p>
							<img src="../images/my/speeker_1.png">
							</div>
						</div>
					</div>
				</div>
				<div class="boxF">
					<div class="boxS">
						<div class="boxT secondBox">
							<div class="rank_box">
							<p>03</p>
							<img src="../images/my/speeker_1.png">
							</div>
						</div>
					</div>
				</div>
				
			</div>
			<!--第三行(lineThird)-->
			<div class="lineS">
				<div class="boxF">
					<div class="boxS">
						<div class="boxT thirdBox">
							<div class="rank_box">
							<p>04</p>
							<img src="../images/my/speeker_1.png">
							</div>
						</div>
					</div>
				</div>
				<div class="boxF">
					<div class="boxS">
						<div class="boxT thirdBox">
							<div class="rank_box">
							<p>05</p>
							<img src="../images/my/speeker_1.png">
							</div>
						</div>
					</div>
				</div>
				<div class="boxF">
					<div class="boxS">
						<div class="boxT thirdBox">
							<div class="rank_box">
							<p>06</p>
							<img src="../images/my/speeker_1.png">
							</div>
						</div>
					</div>
				</div>
			</div>
			<!--第四行(lineFour)-->
			<div class="lineO">
				<div class="boxF">
					<div class="boxS">
						<div class="boxT fourBox">
							<div class="rank_box">
							<p>07</p>
							<img src="../images/my/speeker_1.png">
							</div>
						</div>
					</div>
				</div>
				<div class="boxF">
					<div class="boxS">
						<div class="boxT fourBox">
							<div class="rank_box">
							<p>08</p>
							<img src="../images/my/speeker_1.png">
							</div>
						</div>
					</div>
				</div>
				<div class="boxF">
					<div class="boxS">
						<div class="boxT fourBox">
							<div class="rank_box">
							<p>09</p>
							<img src="../images/my/speeker_1.png">
							</div>
						</div>
					</div>
				</div>
				<div class="boxF">
					<div class="boxS">
						<div class="boxT fourBox">
							<div class="rank_box">
							<p>10</p>
							<img src="../images/my/speeker_1.png">
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	        <div class="xing_people">
	        	<dl>
	        		<dt>11</dt>
	        		<dd><img src="../images/my/speeker_1.png"/></dd>
	        	</dl>
	        	<dl style="left:26%">
	        		<dt>16</dt>
	        		<dd><img src="../images/my/speeker_1.png"/></dd>
	        	</dl>
	        	<dl class="has_dot_bg">
	        		<dd></dd>
	        	</dl>
	        	<dl style="left:70%">
	        		<dt>12</dt>
	        		<dd><img src="../images/my/speeker_1.png"/></dd>
	        	</dl>
	        </div>
	        <div class="bit_relus">
	        	<h4>众帮规则 ：</h4>
	        	<p>购买项目可获得一定的众帮点</p>
	        	<p>按照众帮点个数进行排名，登顶之后可获得丰厚奖励</p>
	        </div>
	    </div>
	</div>
</div>
<script src="../js/mui.min.js"></script>
<script src="../js/jquery-1.11.2.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
mui.init({
	statusBarBackground:'#fff',
	gestureConfig:{
				doubletap:true
			}
});
mui("#mui-scroll").scroll();
$(function(){
	var contentH=$(".mui-scroll-wrapper").outerHeight(true);
	console.log(contentH)
	$("body").height(contentH+44);
	var w =$(".rank_big_box").width();
	var a =154/750;
	var b =185/154;
	var w2 =w*a;
	var h =w2*b;
	//alert(w2);
	//alert(h);
	$(".boxF").css({ "width": w2, "height":h });
	$(".boxS").css({ "width": w2, "height":h });
	$(".boxT").css({ "width": w2, "height":h });
	$(".overlay").css({ "width": w2, "height":h });
	var wf =$(".lineF").width();
	var ws =$(".lineS").width();
	var wo =$(".lineO").width();
	var w3 =$(".line3").width();
	var wf2 =(w-wf)/2;
	var ws2 =(w-ws)/2;
	var wo2 =(w-wo)/2;
	var w32 =(w-w3)/2;
	$(".lineF").css("left",wf2);
	$(".lineS").css("left",ws2);
	$(".line3").css("left",w32);
	$(".lineO").css("left",wo2);
	//
	var th =h-15;
	var th2 =th*2;
	var th3 =th*3;
	$(".line3").css("top",th);
	$(".lineS").css("top",th2);
	$(".lineO").css("top",th3);
	
	$(".rank_big_box").height(th*4.4);
	
	var dotDiv=$(".has_dot_bg");
	var prevLeft=dotDiv.prev().css("left");
	var nextLeft=dotDiv.next().css("left");
		prevLeft=parseInt(prevLeft);
		nextLeft=parseInt(nextLeft);
		//console
	dotDiv.width(nextLeft-prevLeft-100);
	dotDiv.css("left",prevLeft+80+"px");
	
	
	
});
</script>	
</body>
</html>